<template>
  <data-list />
</template>
<script name="MDataIndex" setup>
import DataList from "../index.vue";
</script>

<style lang="scss" scoped>
.app-container {
  width: 100%;
}

:deep(.vxe-tools--wrapper) {
  display: none !important;
}

:deep(.vxe-tools--operate) {
  padding-left: 10px;
}
// vxe-tools--operate 第一个button隐藏
:deep(.vxe-tools--operate button:first-child) {
  visibility: hidden !important;
}

:deep(.vxe-buttons--wrapper button) {
  display: none !important;
}

:deep(.project-form) {
  background-color: #ffffff !important;
  width: 100% !important;
}

:deep(.vxe-export--panel tr:last-child) {
  display: none !important;
}

:deep(.dialog-form .toolbar) {
  display: none !important;
}

:deep(.dialog-form) {
  display: flex !important;
  flex-wrap: wrap;
  overflow: scroll;
}
:deep(.dialog-form .left) {
  width: 100% !important;
}
:deep(.dialog-form .right) {
  width: 100% !important;
}

@media screen and (max-width: 500px) {
  :deep(.vxe-pager) {
    padding-top: 30px !important;
  }
  :deep(.vxe-modal--box) {
    width: 100% !important;
  }
  :deep(.el-dialog__wrapper .el-dialog) {
    width: 100% !important;
  }
  :deep(.vxe-toolbar) {
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 10px;
    height: 100px;

    &:last-child .el-button {
      margin-left: 0px;
    }

    .vxe-toolbar {
      margin-top: 10px;
    }
  }
}
</style>
